React + axios + Django 前後分離CSRF傳遞

在後端Django如需傳遞彼此間要確認的CSRF那在後端的配置上面就需要增加@ensure_csrf_cookie
類似如下

@ensure_csrf_cookie
def login_auth(request):
    if request.method != "POST":
        return HttpResponse()
    login_state = {}
    .....

而在Django官方給出的解決方案

就是使用ensure_csrf_cookie，透過cookies方式將CSRFToken發至前端。
但要注意不能將CSRF_COOKIE_SECURE設定為True，否則前端讀不到CSRF的Token

因前後端分離，前端再進行post之前需要先get一次來獲取包含csrftoken的cookies。
ps:Django預設的token在cookies內的名稱就是：csrftoken

axios.get('/Auth/Register')
  .then(()=>{
      this.authUserSending(new Date().getTime())
  })
  .catch((err) => {
      this.networkErr(err);
  });

接這藉由此次get取得csrftoken之後，將得到的token放入Header裡的X-CSRFToken，便可正常進行post資料。
而cookies的取得則是使用 universal-cookie套件來進行

import Cookies from 'universal-cookie';
const cookies = new Cookies();
axios.post('/Auth/Register',
    {
        accessID: this.state.userName,
        accessPWD: this.state.userPassWD,
        nowTime: timeStamp
    },
    {
        headers:{
            'X-CSRFToken':cookies.get('csrftoken')
        }
    })
    .then((response) => {
    ......